@import 'ama-theming.scss';
@import '@alfresco/adf-core/theming';
@import '~@angular/material/theming';

@include mat-core($alfresco-typography);

body, html {
    margin: 0;
    height: 100%;
    overflow: hidden;
    font-size: mat-font-size($alfresco-typography, body-1);
    font-family: mat-font-family($alfresco-typography);
    line-height: mat-line-height($alfresco-typography, body-1);
}

body {
    overflow: auto;
}

.adf-full-width { width: 100%; }

$foreground: map-get($theme, foreground);
$background: map-get($theme, background);
$warn: map-get($theme, warn);
$accent: map-get($theme, accent);
$primary: map-get($theme, primary);

// map SCSS variables to expose as CSS variables
$defaults: (
  --theme-primary-color: mat-color($primary),
  --theme-primary-color-default-contrast: mat-color($primary, default-contrast),
  --theme-warn-color: mat-color($warn),
  --theme-warn-color-default-contrast: mat-color($warn, default-contrast),
  --theme-accent-color: mat-color($accent),
  --theme-background-color: mat-color($background, background),
  --theme-text-fg-color: mat-color($foreground, text),
  --theme-text-color: mat-color($foreground, text, 0.54),
  --theme-text-bold-color: mat-color($foreground, text, 0.87),
  --theme-title-color: mat-color($foreground, text, 0.87),
  --theme-text-disabled-color: mat-color($foreground, text, 0.38),
  --theme-text-selection-color: mat-color($foreground, text, 0.3),
  --theme-border-color: mat-color($foreground, text, 0.07),
  --theme-border-color-light: mat-color($foreground, text, 0.2),
  --theme-card-background-color: mat-color($background, card),
  --theme-foreground-text-color: mat-color($foreground, text, 0.72),
  --theme-foreground-text-bold-color: mat-color($foreground, text, 0.87),
  --theme-secondary-text-color: mat-color($foreground, secondary-text),
  --theme-divider-color: mat-color($foreground, divider, 0.07),
  --theme-divider-color-light: lighten(mat-color($foreground, divider, 0.07), 30),
  --theme-dialog-bg-color: mat-color($background, dialog),
  --theme-app-bar-bg-color: mat-color($background, app-bar),
  --theme-status-bar-bg-color: mat-color($background, status-bar, 0.7),
  --theme-unselected-chip-bg-color: mat-color($background, unselected-chip),
  --theme-disabled-text-color: mat-color($foreground, disabled-text),
  --theme-selected-button-bg-color: mat-color($background, selected-button),
  --theme-raised-button-bg-color: mat-color($background, raised-button),
  --theme-icons-fg-color: mat-color($foreground, icons),
  --theme-slider-off-fg-color: mat-color($foreground, slider-off),
  --theme-ama-palette-header-bg-color: mat-color($foreground, text, 0.08),
  --theme-ama-palette-bg-color: mat-color($foreground, text, 0.03),
  --theme-ama-palette-separator-color: mat-color($foreground, text, 0.05),
  --theme-ama-var-selector-bg-color: mat-color($foreground, text, 0.05),
  --theme-ama-var-selector-selected-text-bg-color: mat-color($foreground, text, 0.1),
  --theme-ama-form-editor-btn-color: mat-color($foreground, text, 0.25),
  --theme-ama-form-editor-btn-hover-color: mat-color($foreground, text, 1),
  --theme-ama-form-editor-text-drag-color: mat-color($foreground, text, 0.4),
  --theme-ama-condition-builder-primary-text-color: mat-color($primary, text, 0.75),
  --theme-ama-condition-builder-accent-text-color: mat-color($accent, text, 0.75),
  --theme-disabled-bg-color: mat-color($foreground, text, 0.05),
  --theme-hint-bg-color: mat-color($foreground, text, 0.5),
  --theme-font-family: mat-font-family($alfresco-typography),
  --theme-body-1-font-size: mat-font-size($alfresco-typography, body-1),
  --theme-body-1-line-height: mat-line-height($alfresco-typography, body-1),
  --theme-caption-font-size: mat-font-size($alfresco-typography, caption),
  --theme-title-font-size: mat-font-size($alfresco-typography, title),
  --theme-subheading-2-font-size: mat-font-size($alfresco-typography, subheading-2),
  --theme-card-bg-color: mat-color($background, card),
  --adf-card-view-datetime-border-color: mat-color($foreground, text, 0.42),

  // ADF components and services
  --adf-snackbar-error-bg-color: mat-color($warn),
  --adf-snackbar-error-action-color: white,
  --adf-snackbar-warning-bg-color: mat-color($accent),
  --adf-snackbar-warning-action-color: white,
  --adf-snackbar-info-bg-color: mat-color($primary),
  --adf-snackbar-info-action-color: white,
  --adf-header-text-color: mat-color($primary, default-contrast),
  --adf-user-info-color: mat-color($primary, 300),
);

// propagates SCSS variables into the CSS variables scope
:root {
  @each $name, $value in $defaults {
    #{$name}: #{$value};
  }
}

body {
    @include angular-material-theme($theme);
    @include adf-core-theme($theme);
}

body.dark-theme {
    @include angular-material-theme($dark-theme);
    @include adf-core-theme($dark-theme);
}
